//****************************
//功能名称：Tab
//编写人  ：邬畏畏
//博客    :www.cnblogs.com/wsoft
//描述    :生成Tab控制所有功能
//生成的元素基本结构：
/*   代码布局示例
	var divContent = '<div id="wTab" class="wTab">' + 
						'<ul id="Tabs">' +
							'<li id="Tab1" class="tabs">tab1</li>'+
							'<li id="Tab2" class="tabs">tab1</li>'+
						'</ul>'+
						'<ul id="tabContent" class="tabContent">'+
							'<li id="tabContent1">tab1content</li>'+
							'<li id="tabContent2">tab1content</li>'+
						'</ul>'+
					'</div>';
*/

//****************************
var wTab = function(){
	this.version="1.0";
	this.tabHeight=30;
	this.tabwidth=50;
	this.contentStyle="";/*所有content的样式*/
	this.tabCount=0;     /*标签的个数*/
	this.tabCaptionAr=[];/*Tab标签的数组*/
	this.tabContentAr=[];/*Tab内容的数组*/
	this.parent=null;
	this.autoHeight=false;/*自动适应页面大小，但需要一个固定值*/
	this.Diff=0;/*在使用自动满屏高度时，如果高度超出的话，设置Diff*/
	this.addNew=false; /*是否是后来新添加页面，在addNewTab()方法设置为true*/
	this.refresh=[];/*表示单击Tab标签是否需要刷新当前页面，-1=表示不刷新，1=表示刷新，此数值在addTab()方法中初始化*/
	this.click=null; /*回调函数*/
	this.isdivtab=false;/*tab标签是否含有DIV，可以通过设置类样式 .tablef和.tabright来实现复杂的tab标签效果*/
};

wTab.About=function(){
	var space="                ";
	alert("Version:1.0\n\n作者：邬畏畏"+space);
}

wTab.getChild=function(){/*暂时不用*/
	var child = this.parent.children[0].children[1].children;
	var childTab = this.parent.children[0].children[0].children;
}

/*首次添加Tab选项卡,然后再调用initTab*/
wTab.prototype.addTab=function(tab,src,fresh){
	this.tabCaptionAr.push(tab);
	this.tabContentAr.push(src);
	this.tabCount++;
	if(fresh=="refresh")
	{
		this.refresh.push(1);
	}
	else
	{
		this.refresh.push(-1);
	}
};
/*运行时动态添加Tab选项卡*/
wTab.prototype.addNewTab=function(parent,tab,src){
	this.parent = document.getElementById(parent);
	var child = this.parent.children[0].children[1];
	var childTab = this.parent.children[0].children[0];
	this.tabCaptionAr.push(tab);
	this.tabContentAr.push(src);
	this.tabCount++;
	this.addNew=true;
	
	var tabli = '<li id="Tab{id}" class="tab">{caption}</li>';
	var tabContentli ='<li id="tabContent{id}"><iframe id="wifr" frameborder="0" src="{src}" style="width:100%;height:100%"></iframe></li>';
	var tmp = "",strA="",strB="";
	var i;

	tmp = tabli.replace("{id}",this.tabCaptionAr.length-1);
	tmp = tmp.replace("{caption}",this.tabCaptionAr[this.tabCaptionAr.length-1]);
	strA = strA + tmp;

	tmp = tabContentli.replace("{id}",this.tabContentAr.length-1);
	tmp = tmp.replace("{src}",this.tabContentAr[this.tabContentAr.length-1]);
	strB = strB + tmp;

	childTab.innerHTML = childTab.innerHTML + strA;
	child.innerHTML = child.innerHTML + strB;
	this.initEvent(parent);
	this.hideAllContent(parent,0);

};

/*生成tab控件的入口*/
wTab.prototype.initTab = function(parent,callback){  /*parent是ID，string类型*/
	this.parent = document.getElementById(parent);
	var tabli;
	if(this.isdivtab)
	{
		tabli = '<li id="Tab{id}" class="tab"><div class="tabLeft" style="float:left"></div><div style="float:left">{caption}</div><div class="tabRight" style="float:left"></div></li>';
	}
	else
	{
		tabli = '<li id="Tab{id}" class="tab">{caption}</li>';
	}
	var tabContentli ='<li id="tabContent{id}"><iframe id="wifr" frameborder="0" src="{src}" style="width:100%;height:100%"></iframe></li>';
	
	var divContent = '<div id="wTab" class="wTab">' + 
						'<ul id="Tabs" class="Tabs">{nr1}' +
						'</ul>'+
						'<ul id="tabContent" class="tabContent" style="{style}">{nr2}'+
						'</ul>'+
					'</div>';
	var tmp = "",strA="",strB="";
	var i,dom;
	for(i=0;i<this.tabCaptionAr.length;i++)
	{
		tmp = tabli.replace("{id}",i);
		tmp = tmp.replace("{caption}",this.tabCaptionAr[i]);
		strA = strA + tmp;

		tmp = tabContentli.replace("{id}",i);
		/*如果this.tabContentAr[i]中含有"."就是用<iframe>，否则把<iframe>替换为this.tabContentAr[i]中的DOM元素的innerHTML*/
		if(this.tabContentAr[i].indexOf(".")>0)
		{
			tmp = tmp.replace("{src}",this.tabContentAr[i]);
		}
		else
		{
			dom = document.getElementById(this.tabContentAr[i]);
			tmp = tmp.replace('<iframe id="wifr" frameborder="0" src="{src}" style="width:100%;height:100%"></iframe>',dom.innerHTML);
			dom.innerHTML="";
		}
		strB = strB + tmp;		
	}

	divContent = divContent.replace("{nr1}",strA);
	divContent = divContent.replace("{nr2}",strB);
	divContent = divContent.replace("{style}",this.contentStyle);
	this.parent.innerHTML=divContent;
	this.hideAllContent(parent,0);
	if(callback!=undefined)
	{this.click = callback;}
	this.initEvent(parent);
}

wTab.prototype.initEvent = function(p){
	var t = document.getElementById(p);
	var This=this;
	var child = t.children[0].children[0].children;
	var childTab = t.children[0].children[0].children;
	var i;
	var diff,docHeight;
	for(i=0;i<child.length;i++)
	{
		child[i].onclick = function(index){
			return function(){
				This.onclick(p,index);
				if(This.click!=null)
				{
					This.click.call(this,index);
				}
			}
		}(i);
	}
	
	if(this.addNew)/*如果是后添加的tab,即通过addNewTab()方法调用的*/
	{childTab[this.tabCount-1].className="tabH";}
	else
	{childTab[0].className="tabH";}
	
	/*setTimeout(function(){*/
		$("#"+p+" #wifr").height($("#"+p+" .tabContent").height());
		if(this.autoHeight)
		{
			$("#"+p+" .tabContent")[0].style.height="auto";
			diff=$("#"+p+" #Tabs li").height();
			docHeight = document.documentElement.clientHeight;
			$("#"+p+" #wifr").height(docHeight-this.Diff-diff-5);
			$("#"+p+" .tabContent > li").height(docHeight-this.Diff-diff-3);
		}
	/*},100)*/
}

wTab.prototype.onclick = function(p,e){
	var t = document.getElementById(p);
	var child = t.children[0].children[1].children;
	var childTab = t.children[0].children[0].children;
	var i;
	var that;
	this.hideAllContent(p,e);
	for(i=0;i<child.length;i++)
	{
		that = child[i];
		if(child[i].id.substr(child[i].id.length-1)==e)
		{
			that.style.display="block";
			childTab[i].className="tabH";
			/*$(child[i]).find("iframe")[0].contentWindow.document.location.reload();*/
			if(this.refresh[i]==1)
			{
				$(child[i]).find("iframe")[0].src=$(child[i]).find("iframe")[0].src+"?fid=1";
			}
		}
	}
}

wTab.prototype.hideAllContent = function(p,n){   /*n=-1表示content全部隐藏，n=0,表示tabContent0显示*/
	var t = document.getElementById(p);
	var child = t.children[0].children[1].children;
	var childTab = t.children[0].children[0].children;
	var i;
	var that;
	for(i=0;i<child.length;i++)
	{
		child[i].style.display="none";
		childTab[i].className="tab";
	}
	child[n].style.display="block";
	childTab[n].className="tabH";
}


